<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>圣罗兰的列表</title>
  <link rel="stylesheet" href="/libs/bootstrap/css/bootstrap.min.css">
  <link rel="stylesheet" href="/libs/font/iconfont.css">
  <link rel="stylesheet" href="/css/listPage.css">
</head>
<body>
  <!-- 头部 -->
  <header></header>

  <div class="listPicture">
    <img src="https://res.yslbeautycn.com/resources/2020/11/11/16050888988651003.jpg">
  </div>
  
  <!-- 列表头部窗口 -->
  <div class="xiangShui">
    <div class="xing">
      <p>香水</p>
      <!-- 下拉列表 -->
      <div class="btn-group">
        <button class="btn btn-default btn-lg dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
          排序选择<span class="caret"></span>
        </button>
        <ul class="dropdown-menu">
          <li id="shenXu">价格从低到高排序</li>
          <li id="py">选择价格在10-20元</li>
        </ul>
      </div>
    </div>
  </div>
  <!-- 下面列表 -->
  <div class="main">
    <div class="xing">
      <!-- 侧边栏 -->
      <div class="side">
        <div class="kuChun">
          <p>库存</p>
          <button class="btn btn-default" type="submit">仅看有货</button>
        </div>
        <div class="dzfw">
          <p>定制服务</p>
          <button class="btn btn-default" type="submit">支持刻字</button>
        </div>
        <div class="cpfw">
          <p>产品分类</p>
          <i class="iconfont icon-gengduo"></i>
        </div>
        <div class="xl">
          <p>系列</p>
          <i class="iconfont icon-gengduo"></i>
        </div>
        <div class="jgfw">
          <p>价格范围</p>
          <i class="iconfont icon-gengduo"></i>
        </div>
        <div class="gg">
          <p>规格</p>
          <i class="iconfont icon-gengduo"></i>
        </div>
        <button class="btn btn-default anliu" type="submit" id="an">重置</button>
      </div>
      <!-- 正儿八经的香水列表 -->
      <div class="list" id="list_tabs">
        
      </div>
      <script type="text/html" id="list_tabs_template">
        {{each yeMan item}}
        <div class="{{item.type === 2 ? 'ads' : 'list1'}}">
          <a href="/html/details.html?id={{item.id}}" target = "_blank">
            <img src="{{item.image}}">
            {{if item.type === 1}}
            <p class="eng">{{item.taobaoCid}}</p>
            <p class="sheng">{{item.title.slice(0,10)}}...</p>
            <p class="price">￥{{item.price}}</p>
            <button class="btn btn-default anliu" type="submit" id="an">立即购买</button>
            {{/if}} 
          </a>
        </div>
        {{/each}}
      </script>
    </div>
  </div>

  <!-- 尾部 -->
  <footer></footer>

  <!-- 引入JS模块 -->
  <script src="/libs/require/require.min.js" data-main="/js/listPage"></script>
</body>
</html>